<template>
	<view class="loader16"><view></view></view>
</template>
<script>
</script>
<style>
	.loader16 {
	 display: inline-block;
	 position: relative;
	 width: 80px;
	 height: 80px;
	 transform: rotate(45deg);
	 transform-origin: 40px 40px;
	}
	
	.loader16 view {
	 top: 32px;
	 left: 32px;
	 position: absolute;
	 width: 32px;
	 height: 32px;
	 background: red;
	 animation: loader1645 1.2s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
	}
	
	.loader16 view:after,
	.loader16 view:before {
	 content: " ";
	 position: absolute;
	 display: block;
	 width: 32px;
	 height: 32px;
	 background: red;
	}
	
	.loader16 view:before {
	 left: -24px;
	 border-radius: 50% 0 0 50%;
	}
	
	.loader16 view:after {
	 top: -24px;
	 border-radius: 50% 50% 0 0;
	}
	
	@keyframes loader1645 {
	 0% {
	  transform: scale(0.95);
	 }
	
	 5% {
	  transform: scale(1.1);
	 }
	
	 39% {
	  transform: scale(0.85);
	 }
	
	 45% {
	  transform: scale(1);
	 }
	
	 60% {
	  transform: scale(0.95);
	 }
	
	 100% {
	  transform: scale(0.9);
	 }
	}
</style>
